@extends('layouts.auth')

@section('title', '个人信息')

@section('content')
<div class="P-UserCenter mt-2">
    <div class="container">
        <div class="row d-none d-md-block bg-white mb-3 rounded shadow-sm">
            @include('auth.partials.subnav')
        </div>

        <div class="row bg-white px-4 py-5 rounded shadow-sm">
            <h2 class="pb-2 border-bottom">基本信息</h2>

            <div class="row row-cols-1 row-cols-md-2 align-items-md-center g-5 py-5">
            <div class="col d-flex flex-column align-items-start gap-2">
                <h2 class="fw-bold text-body-emphasis">Left-aligned title explaining these awesome features</h2>
                <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading. We'll add onto it with another sentence and probably just keep going until we run out of words.</p>
                <a href="#" class="btn btn-primary btn-lg">Primary button</a>
            </div>

            <div class="col">
                <div class="row row-cols-1 row-cols-sm-2 g-4">
                <div class="col d-flex flex-column gap-2">
                    <h4 class="fw-semibold mb-0 text-body-emphasis">Featured title</h4>
                    <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p>
                </div>

                <div class="col d-flex flex-column gap-2">
                    <h4 class="fw-semibold mb-0 text-body-emphasis">Featured title</h4>
                    <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p>
                </div>

                <div class="col d-flex flex-column gap-2">
                    <h4 class="fw-semibold mb-0 text-body-emphasis">Featured title</h4>
                    <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p>
                </div>

                <div class="col d-flex flex-column gap-2">
                    <h4 class="fw-semibold mb-0 text-body-emphasis">登陆状况</h4>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item">An item</li>
                        <li class="list-group-item">A second item</li>
                        <li class="list-group-item">A third item</li>
                        <li class="list-group-item">A fourth item</li>
                        <li class="list-group-item">{{ $user->add->updated_at }}</li>
                    </ul>
                </div>
                </div>
            </div>
            </div>
        </div>
    </div>
</div>
@endsection
